<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/cs_header.css">
    <link rel="stylesheet" href="./css/cs_main_header.css">
    <link rel="stylesheet" href="./css/cs_main_swiper.css">
    <link rel="stylesheet" href="./css/cs_main_request.css">
    <link rel="stylesheet" href="./css/cs_footer.css">
    <title>入职测试考核题</title>
</head>

<body>
    <div class="cs-wrapper">
        <header class="cs-header">
            <div class="container">
                <section class="cs-header-left">
                    <div class="logo">
                        <span>LOGO</span>
                    </div>
                </section>
                <section class="cs-header-right">
                    <div class="image"><img src="./icon/setup.png" alt="设置图标"></div>
                    <div class="image"><img src="./icon/message.png" alt="消息"></div>
                    <div class="log-out"><span>Log Out</span></div>
                </section>
            </div>
        </header>
        <main class="cs-main">
            <div class="container">
                <article class="cs-main-header">
                    <section class="cs-main-title">
                        <div class="title"><span>Audience Overview</span></div>
                        <div class="small-title"><span>Roseville,CA</span></div>
                    </section>
                    <section class="cs-main-nav">
                        <div class="tab-list">
                            <ul>
                                <li class="current">DASHBOARD</li>
                                <li>PROJECTS</li>
                                <li>CALENDAR</li>
                                <li>MAILBOX</li>
                                <li>SETTINGS</li>
                                <div class="line"></div>
                            </ul>
                        </div>
                    </section>
                </article>

                <article class="cs-main-content">
                    <section class="main-content-header">
                        <section class="cs-main-swiper">
                            <div class="swiper-container">
                                <div class="banner">
                                    <ul>
                                        <li>
                                            <a href="#"><img src="./icon/images/1.jpg" alt="轮播图1"></a>
                                        </li>
                                        <li>
                                            <a href="#"><img src="./icon/images/2.jpg" alt="轮播图2"></a>
                                        </li>
                                        <li>
                                            <a href="#"><img src="./icon/images/3.jpg" alt="轮播图3"></a>
                                        </li>
                                        <li>
                                            <a href="#"><img src="./icon/images/4.jpg" alt="轮播图4"></a>
                                        </li>
                                        <li>
                                            <a href="#"><img src="./icon/images/5.jpg" alt="轮播图5"></a>
                                        </li>
                                        <li>
                                            <a href="#"><img src="./icon/images/1.jpg" alt="轮播图1"></a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="point">
                                    <ol>
                                        <li class="active"></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                    </ol>
                                </div>
                                <div class="btn-left"><span class="icon"></span></div>
                                <div class="btn-right"><span class="icon"></span></div>
                            </div>
                        </section>
                        <section class="cs-main-request">
                            <div class="request-container">
                                <div class="request-top">
                                    <div class="title"><span>Support Requests</span></div>
                                    <div class="view-all"><span>View All</span></div>
                                </div>
                                <div class="request-bottom">
                                    <table>
                                        <tr style="color: #515558; padding-bottom: 40px;">
                                            <th style="width:60px">TIME</th>
                                            <th style="width:250px;">USER NAME</th>
                                            <th style="width:150px;box-sizing: border-box; padding-left: 80px;">STATUS
                                            </th>
                                        </tr>
                                        <tr>
                                            <td style="width:60px; ">9:45prn</td>
                                            <td style="width:250px; ">info@design.com</td>
                                            <td><button>Solved</button></td>
                                        </tr>
                                        <tr>
                                            <td style="width:60px;">9:45prn</td>
                                            <td style="width:250px; ">info@design.com</td>
                                            <td><button>Solved</button></td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                        </section>
                    </section>
                    <section class="main-echarts-month" style="background-color: white; margin-top: 20px;">
                        <div id="main-month" style="width: 100%;height:400px;"></div>
                    </section>
                    <section class="main-echarts-week" style="margin-top: 20px;">
                        <section class="main-echart-bing" style="background-color: white;">
                            <div id="main-bing" style="width: 560px;height: 380px;"></div>
                        </section>
                        <section class="main-echart-shu" style="background-color: white;">
                            <div id="main-shu" style="width: 560px;height: 380px;"></div>
                        </section>
                    </section>
                </article>
            </div>
        </main>
        <footer class="cs-footer">
            <div class="container">
                <section class="cs-footer-left">
                    <div class="logo">
                        <span>LOGO</span>
                    </div>
                </section>
                <section class="cs-footer-right">
                        <ul>
                            <li>NEWS</li>
                            <li>CHANNELS</li>
                            <li>OVERVIEW</li>
                            <li>TIMELINE</li>
                        </ul>
                        <ul>
                            <li>SPORT</li>
                            <li>CULTURE</li>
                            <li>NATURE</li>
                            <li>MUSIC</li>
                        </ul>
                        <ul>
                            <li>WHEATHER</li>
                            <li>AUTOS</li>
                            <li>LOCAL</li>
                            <li>SHOP</li>
                        </ul>
                        <ul>
                            <li>FUTURE</li>
                            <li>FOOD</li>
                            <li>EARTH</li>
                            <li>TV</li>
                        </ul>
                        <ul>
                            <li>TRAVEL</li>
                            <li>RADIO</li>
                        </ul>
                </section>
            </div>
        </footer>
    </div>
    <script src="./js/animate.js"></script>
    <script src="./js/swiper.js"></script>
    <script src="./js/echarts.js"></script>
    <script src="./js/Ajax.js"></script>
    <script src="./js/nav.js"></script>
</body>

</html>